<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="format-detection" content="telephone=no">
<meta http-equiv="Cache-Control" content="no-siteapp">
<link rel="stylesheet" href="../../../static/layui/css/layui.css" media="all" />
<link rel="stylesheet" href="../../../static/css/public.css" media="all" />
<link rel="stylesheet" href="../../../static/plugin/zTree/css/zTreeStyle/zTreeStyle.css" type="text/css">
</head>
<body class="childrenBody">
	<form class="layui-form">
		<blockquote class="layui-elem-quote quoteBox">
			<form class="layui-form">
				<div class="layui-inline" has-permission="000500000020">
					<label class="layui-form-label">所属部门</label>
					<div class="layui-input-inline">
						<input type="text" class="layui-input" id="dname" readonly lay-verify="required" placeholder=""> <input type="hidden" class="searchVal" name="did" id="did">
					</div>
					<a class="layui-btn" id="btn_treeClean">清空</a>
				</div>
				<div class="layui-inline" has-permission="000500000020">
					<label class="layui-form-label">员工</label>
					<div class="layui-input-block">
						<select name="eid" id="eid" lay-search class="searchVal">
							<option value="">请选择</option>
						</select>
					</div>
				</div>
				<div class="layui-inline">
					<label class="layui-form-label">开始时间</label>
					<div class="layui-input-block">
						<input type="text" class="layui-input searchVal" name="bgdate" id="bgdate">
					</div>
				</div>
				<div class="layui-inline">
					<label class="layui-form-label">结束时间</label>
					<div class="layui-input-block">
						<input type="text" class="layui-input searchVal" name="eddate" id="eddate">
					</div>
				</div>
				<div class="layui-inline" has-permission="000500000020">
					<label class="layui-form-label">状态</label>
					<div class="layui-input-block">
						<select name="stat" id="stat" lay-search class="searchVal">
							<option value="">请选择</option>
							<option value="1">正常</option>
							<option value="2">异常</option>
						</select>
					</div>
				</div>
				<div class="layui-inline" has-permission="000500000020">
					<label class="layui-form-label">审核状态</label>
					<div class="layui-input-block">
						<select name="rwst" id="rwst" lay-search class="searchVal">
							<option value="">请选择</option>
							<option value="1">待审核</option>
							<option value="2">转正常</option>
							<option value="3">已审核</option>
						</select>
					</div>
				</div>
			</form>
		</blockquote>
		<blockquote class="layui-elem-quote quoteBox">
			<div class="layui-inline">
				<a class="layui-btn search_btn" data-type="reload">搜索</a> <a class="layui-btn layui-btn-normal insert_btn" has-permission="000500000000">手工补考勤</a> <a class="layui-btn layui-btn-normal import_btn" has-permission="000500000015">导入数据</a> <a class="layui-btn layui-btn-danger layui-btn-normal delAll_btn" has-permission="000500000025">批量删除</a>
			</div>
		</blockquote>
		<table id="list" lay-filter="list"></table>
		<div class="list-page" id="page"></div>
	</form>
	<div id="treeDiv" class="menuContent" style="display: none; position: absolute; background: white; border: 1px black solid; z-index: 999">
		<ul id="departmentTree" class="ztree" style="margin-top: 0; width: 160px;"></ul>
	</div>
	<script type="text/javascript" src="../../../static/js/jquery-2.1.1.min.js"></script>
	<script type="text/javascript" src="../../../static/layui/layui.js"></script>
	<script type="text/javascript" src="../../../static/custom/js/common.js"></script>
	<script type="text/javascript" src="../../../static/plugin/zTree/js/jquery.ztree.core.js"></script>
	<script type="text/javascript">
		var global = {};
		layui.use([ 'form', 'layer', 'table', 'laypage', 'laytpl', 'laydate' ], function() {
			var listApi = '../../../attendance/attendance/list';
			var toInsertHtml = 'insert.html';
			var toUpdateHtml = 'insert.html';
			var toRemarksHtml = 'remarks.html';
			var toApproveHtml = 'approve.html';
			var toUpdateDetailhtml = 'updateDetail.html';
			var deleteApi = '../../../attendance/attendance/delete';
			var toImportHtml = 'import.html';
			var usr = JSON.parse( sessionStorage.getItem("user") )
			
			var param = merger(param,getsearchVal());
			var cols = [ [ {
				//type : "checkbox",
				fixed : "left",
				width : 50,
				title : '<input type="checkbox" lay-skin="primary"  id="check-all" class="check-all" lay-filter="check-all">',
				templet : function(d) {
					var str = '';
					if (!hasProtect(d)) {
						str += '<input type="checkbox" lay-skin="primary" class="check-one"  value="'+d.id+'" lay-filter="check-one">';
					} else {
						str += '<input type="checkbox" lay-skin="primary" class="check-one"  value="'+d.id+'" lay-filter="check-one" disabled >';
					}
					return str;
				}
			}, {
				field : 'ername',
				title : '员工',
				align : "center"
			}, {
				field : 'dname',
				title : '部门',
				align : "center"
			}, {
				field : 'date',
				title : '日期',
				align : 'center'
			}, {
				field : 'ckin',
				title : '签入时间',
				align : "center"
			}, {
				field : 'ckot',
				title : '签出时间',
				align : "center"
			}, {
				field : 'stat',
				title : '状态',
				align : "center",
				templet : function(d) {
					var str = d.stat == 1 ? '<span class="layui-badge layui-btn-green">正常</span>' : '<span class="layui-badge">异常</span>';
					return str;
				}
			}, {
				title : '审核状态',
				align : 'center',
				templet : function(d) {
						return d.rwst == 1 ? '<span class="layui-badge layui-bg-orange">待审核</span>' : d.rwst == 2 ? '<span class="layui-badge layui-bg-green">转正常</span>' : d.rwst == 3 ? '<span class="layui-badge">已审核</span>':'';
				}
			}, {
				title : '操作',
				fixed : "right",
				align : "center",
				width : 300,
				templet : function(d) {
					var str = '';
					if (hasPermission('000500000030') &&  usr.id==d.eid && d.stat=="2"&&d.rwst==null) {
						str += '<a class="layui-btn layui-btn-xs" lay-event="toRemarks">异常原因</a>';
					}
					if (hasPermission('000500000040')&&isDsub(d.did)&&d.stat=="2"&&d.rwst=='1') {
						str += '<a class="layui-btn layui-btn-xs" lay-event="toApprove">审批</a>';
					}
					if (hasPermission('000500000035')&&(d.rwst=='2'||d.rwst=='3')) {
						str += '<a class="layui-btn layui-btn-xs" lay-event="toUpdateDetail">查看</a>';
					}
					if (hasPermission('000500000010')) {
						str += '<a class="layui-btn layui-btn-xs layui-btn-danger" lay-event="delete">删除</a>';
					}
					return str;
				}
			} ] ];

			//获取参数
			global.getParam = function() {
				param =  merger(param, getsearchVal());
				return param;
			}
			var form = layui.form, layer = parent.layer === undefined ? layui.layer : top.layer;
			var $ = layui.jquery;
			var laytpl = layui.laytpl;
			var table = layui.table;
			var laydate = layui.laydate;
			var laypage = layui.laypage;
			laydate.render({
				 elem: '#bgdate' //指定元素
			});
			laydate.render({
				 elem: '#eddate' //指定元素
			});
			tableIns = table.render({
				elem : '#list',
				cellMinWidth : constant.table.cellMinWidth,
				page : false,
				height : constant.table.height,
				cols : cols,
				done : function(res, page, count) {
					checkAll(form);
				}
			});
			global.listLoad = function listLoad(data) {
				loadAjax( listApi, "get", data, function(response) {
					baseCallBack(response, function(response) {
						table.reload("list", {
							data : response.data.records,
							limit : response.data.records.length
						//显示的数量
						})
						var page = laypage.render({
							elem : 'page',
							limits : constant.page.limits,
							limit : response.data.size,
							layout : constant.page.layout,
							curr : response.data.current,
							count : response.data.total,
							jump : function(obj, first) {
								if (!first) {
									param = merger(constant.page.toUri(obj), getsearchVal());
									global.listLoad(param);
								}
							}
						});
					});
				});
			}

			//用户列表
			global.listLoad(global.getParam());
			//搜索【此功能需要后台配合，所以暂时没有动态效果演示】
			$(".search_btn").on("click", function() {
				param = merger(param, getsearchVal());
				global.listLoad(param);
			});

			//添加
			$(".insert_btn").click(function() {
				openAreaLayer("添加", toInsertHtml, "700px", "500px", true);
			});

			$(".import_btn").click(function() {
				openAreaLayer("添加", toImportHtml, "480px", "360px", true);
			});
			
			//批量删除
			$(".delAll_btn").click(function() {
				var ids = getCheckedId();
				if (ids && ids.length) {
					confirmLayer('提示信息', '确定删除？', function(confirm, index) {
						loadAjax( deleteApi + "/" + ids, "delete", null, function(response) {
							baseCallBack(response, function(response) {
								layer.msg(response.msg);
								global.listLoad(param);
								confirm.close(index);
							});
						});
					})

				} else {
					layer.msg("请选择需要删除的数据");
				}
			});

			//列表操作
			table.on('tool(list)', function(obj) {
				var layEvent = obj.event;
				var data = obj.data;
				 if (layEvent === 'toRemarks' ) {
					//异常原因
					openAreaLayer("异常原因", toRemarksHtml + "?id=" + data.id,"700px", "500px");
				}else if (layEvent === 'toApprove') {
					//审批
					openAreaLayer("审批", toApproveHtml + "?id=" + data.id,"700px", "500px");
				}else if (layEvent === 'toUpdateDetail') {
					//查看
					openAreaLayer("查看", toUpdateDetailhtml + "?id=" + data.id,"900px", "450px");
				}else if (layEvent === 'delete') {
					//删除
					confirmLayer('提示信息', '确定删除？', function(confirm, index) {
						loadAjax( deleteApi + "/" + data.id, "delete", null, function(response) {
							baseCallBack(response, function(response) {
								layer.msg(response.msg);
								global.listLoad(param);
								confirm.close(index);
							});
						});
					})
				}
			});

			//ztree
			var setting = {
				view : {
					dblClickExpand : false
				},
				data : {
					simpleData : {
						enable : true
					}
				},
				callback : {
					onClick : onClick
				}
			};
			function onClick(e, treeId, treeNode) {
				$("#did").val(treeNode.id);
				$("#dname").val(treeNode.name);
				hideMenu();
				//开启选择框
				eidSelectChange(2);
				//查找员工
				loadAjax( "../../../getEmployee", "get", {
					"did" : treeNode.id
				}, function(response) {
					baseCallBack(response, function(response) {
						$("#eid").empty();
						var str = '<option value="">请选择</option>';
						for( data of response.data){
							str+='<option value="'+data.id+'">'+data.rname+'</option>';
						}
						$("#eid").append(str);
						form.render('select');
					});
				});
			}
			$("#btn_treeClean").click(function() {
				$("#did").val('');
				$("#dname").val('');
				$("#eid").val('');
				eidSelectChange(1);
			})
			function showMenu() {
				var cityObj = $("#dname");
				var cityOffset = $("#dname").offset();
				$("#treeDiv").css({
					left : cityOffset.left + "px",
					top : cityOffset.top + cityObj.outerHeight() + "px"
				}).slideDown("fast");
				$("body").bind("mousedown", onBodyDown);
			}
			function hideMenu() {
				$("#treeDiv").fadeOut("fast");
				$("body").unbind("mousedown", onBodyDown);
			}
			function onBodyDown(event) {
				if (!(event.target.id == "btn_treeSelect" || event.target.id == "treeDiv" || $(event.target).parents("#treeDiv").length > 0)) {
					hideMenu();
				}
			}
			$("#dname").click(function() {
				showMenu()
			})
			
			loadAjax( "../../../getDepartment", "get", {
				"did" : cache.did.get()
			}, function(response) {
				baseCallBack(response, function(response) {
					$.fn.zTree.init($("#departmentTree"), setting, response.data);
					eidSelectChange(1);
				});
			});

			function eidSelectChange(flag) {
				if (flag == 1) {
					$("#eid").attr("disabled", "true")
				} else {
					$("#eid").removeAttr("disabled");
					$("#eid").val('');
				}
				form.render('select');
			}

		})
	</script>
</body>
</html>